<script setup lang="ts">
import './node-style.scss'
import {inject, ref} from "vue";
import {Node} from "@antv/x6";

const id=ref<string>()
const formData = reactive<any>({
  useTemp:true,
  memorySize:100,
})
const getNode=inject<()=>Node>('getNode')
if(getNode){
  const node=getNode()
  id.value=node.id
  node.setData(formData)
}

</script>

<template>
  <div class="input">
    <div class="line5">
      <div>加载网盘文件</div>
      <div class="flow-dot flow-right flow-exec" magnet="true" x-type="output-exec" :x-id="'output-exec_'+id"></div>
    </div>
    <el-form
      :model="formData"
      label-position="top"
      @mousedown.stop
      @focus.stop
      style="cursor: default"
    >
      <el-form-item label="内存优化">
        <el-switch v-model="formData.useTemp"/>
      </el-form-item>
      <el-form-item label="文件最大占用内存">
        <el-input-number v-model="formData.memorySize" :step="1" :min="50">
          <template #suffix>
            MB
          </template>
        </el-input-number>
      </el-form-item>
    </el-form>
    <div class="line5">
      <div>文件</div>
      <div class="flow-dot flow-file flow-right" magnet="true" x-type="output-file" :x-id="'output-file_'+id" x-key="file"></div>
    </div>
    <div style="color: #9f9f9f;font-size: 15px">元数据</div>
    <div class="line5">
      <div>URL</div>
      <div class="flow-dot flow-string flow-right" magnet="true" x-type="output-url" :x-id="'output-url_'+id" x-key="url"></div>
    </div>
    <div class="line5">
      <div>文件ID</div>
      <div class="flow-dot flow-string flow-right" magnet="true" x-type="output-id" :x-id="'output-id_'+id" x-key="id"></div>
    </div>
    <div class="line5">
      <div>MediaType</div>
      <div class="flow-dot flow-string flow-right" magnet="true" x-type="output-mediaType" :x-id="'output-mediaType_'+id" x-key="mediaType"></div>
    </div>
  </div>
</template>

<style scoped lang="scss">
</style>
